<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <title>员工注册</title>
    <th:block th:replace="/backstage/common_resources::common_css"></th:block>
    <th:block th:replace="/backstage/common_resources::common_js"></th:block>

</head>

<body class="hold-transition register-page" id="tu">
    <div class="register-box">
        <div class="register-logo">


            <a href="all-admin-index.html" ><b>员工</b>后台管理系统</a>


        </div>

        <div class="register-box-body">
            <p class="login-box-msg">新用户注册</p>

            <form action="/backstage/users/register" method="post">
                <div class="form-group has-feedback">
                    <input type="text" name="username" class="form-control" placeholder="工号">
                    <span class="glyphicon glyphicon-modal-window form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback">
                    <input type="text" name="name" class="form-control" placeholder="姓名">
                    <span class="glyphicon glyphicon-user form-control-feedback"></span>
                </div>

                <div class="form-group has-feedback">
                    <input type="password" name="password" class="form-control" placeholder="密码(四位以上)" minlength="5">
                    <span class="glyphicon glyphicon-lock form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback">
                    <input type="password" name="password1" class="form-control" placeholder="确认密码(四位以上)" minlength="5">
                    <span class="glyphicon glyphicon-lock form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback">
                    <input type="text" id="phoneNum" name="phoneNum" class="form-control" placeholder="电话(请输入11位数字)"  oninput = "value=value.replace(/[^\d]/g,'')">
                    <script>
                        $("#phoneNum").change(function () {
                            if ($(this).val().length!=11){
                                $(this).val("");

                            }
                        })
                    </script>
                    <span class="glyphicon glyphicon-phone form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback">
                    <input type="text" name="address" class="form-control" placeholder="地址">
                    <span class="glyphicon glyphicon-map-marker form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback checkbox">
                    性别：
                    <input type="radio" name="sex" value="男" style="border-color: #00a7d0">男
                    <input type="radio" name="sex" value="女" style="border-color: #00a7d0">女
                </div>
                <div class="form-group has-feedback">
                <label>身份</label>
                <select name="status">
                    <option value="1">老板</option>
                    <option value="0" selected="selected">员工</option>

                </select>
                </div>

                <div class="form-group has-feedback">
                    <input id="txtCode" name="checkCode" type="text" placeholder="验证码" style="width: 45%;"/>
                    <img id="valideteCode" src="/checkCode" style="height: 43px;border-radius: 3px"  onclick="change()"/>
                    <script type="text/javascript">
                        function change() {
                            //图片点击事件
                            //在方法后添加参数的原因是，如果不添加参数，img.src的属性不会改变，此时浏览器不会向服务器发送请求
                            $("#valideteCode").attr("src","/checkCode?"+Math.random());

                        }



                    </script>

                </div>
                <span th:text="${message}" style="color: red"></span>

                <div class="row">

                    <!-- /.col -->
                    <div class="col-xs-4">
                        <button type="submit" class="btn btn-primary btn-block btn-flat">注册</button>
                    </div>
                    <!-- /.col -->
                </div>
            </form>

            <a href="/backstage/login" class="text-center">我有账号，现在就去登录</a>
        </div>
        <!-- /.form-box -->
    </div>
    <!-- /.register-box -->

    <!-- jQuery 2.2.3 -->
    <!-- Bootstrap 3.3.6 -->
    <!-- iCheck -->


</body>

</html>